<template>
	<view>
		<uni-card title="月度统计" style="padding-bottom: 20rpx;" v-for="(item,index) in deptDataBoardSummaries"  :extra="item.monthly">
			<uni-row>
				<uni-col :span="8" >
					<view class="col-title-view" @click="toDormitoryAttenceDetail('dormitory')">宿舍未打卡</view>
				</uni-col>
				<uni-col :span="8" >
					<view class="col-title-view" @click="toDormitoryAttenceDetail('weekend')">周末未打卡</view>
				</uni-col>
				<uni-col :span="8">
					<view  class="col-title-view" @click="toDormitoryAttenceDetail(item, 'retention')">滞留人数</view>
				</uni-col>
			</uni-row>
			<uni-row>
				<uni-col :span="8"  >
						<view class="col-view" @click="toDormitoryAttenceDetail(item, 'dormitory')">{{item.dormitorySummary}}</view>
				</uni-col>
				<uni-col :span="8" >
						<view class="col-view" @click="toDormitoryAttenceDetail(item, 'weekend')">{{item.weekendSummary}}</view>
				</uni-col>
				<uni-col :span="8" >
					<view class="col-view" @click="toDormitoryAttenceDetail(item, 'retention')">{{item.retentionSummary}}</view>
				</uni-col>
			</uni-row>
			<uni-row>
				<uni-col :span="8">
					<view class="col-title-view"  @click="toDormitoryAttenceDetail(item, 'morningExercises')">早操未到</view>
				</uni-col>
				<uni-col :span="8">
					<view  class="col-title-view" @click="toDormitoryAttenceDetail(item, 'patrol')">白天违纪</view>
				</uni-col>
				<uni-col :span="8" >
					<view class="col-title-view" @click="toDormitoryAttenceDetail(item, 'violation')">宿舍违纪</view>
				</uni-col>
			</uni-row>
			<uni-row>
				<uni-col :span="8" >
					<view  class="col-view" @click="toDormitoryAttenceDetail(item, 'morningExercises')">{{item.morningSummary}}</view>
				</uni-col>
				<uni-col :span="8" >
					<view  class="col-view" @click="toDormitoryAttenceDetail(item, 'patrol')">{{item.dayViolationSummary}}</view>
				</uni-col>
				<uni-col :span="8">
					<view  class="col-view" @click="toDormitoryAttenceDetail(item, 'violation')">{{item.nightViolationSummary}}</view>
				</uni-col>
			</uni-row>
		</uni-card>
	</view>
</template>

<script>
	import manageTeacher from '@/api/modules/managementTeacher.js'
	export default {
		data() {
			return {
				boardData: {},
				deptDataBoardSummaries: []
			}
		},
		created() {
			this.userId = uni.getStorageSync("loginId");
			this.roleName = uni.getStorageInfoSync("userRole")
			
			uni.showLoading({title: '加载中...'});
			this.getMonthlyBoardData();
		},
		methods: {
			toDormitoryAttenceDetail(item, type) {
			
				uni.navigateTo({
					url:`/pages_duty/deptManager/statistics/dormitoryMonthlyStatisticsDetail?userId=${this.userId}&month=${item.monthly}&type=${type}`
				})
			
			},
			getMonthlyBoardData() {
				manageTeacher.getMonthlyBoardData(this.userId, this.type).then(res => {
					uni.hideLoading()
					this.deptDataBoardSummaries = res.data	
				}).catch(e => {
					uni.hideLoading()
				})
			}
		}
	}
</script>

<style>
	.col-title-view {
		display: flex;
		justify-content: center; 
		align-items: center; 
		font-size: 15px; 
		font-weight: 400;
	}
	.col-view { 
		font-weight: 700; 
		font-size: 15px; 
		display: flex; 
		justify-content: center;  
		align-items: center;
	}
</style>
